$(function () {

    $(".sendmess").click(function () {
        let people = $(".choose option:selected").text()
        let txt = $(".txt").val()
        $(".row").append(`  <div class="col-md-4 clbox">
            <div class="page-header">
                <h1 class="peo">${people}</h1>
                <p>&emsp;&emsp;${txt}</p>
                <span class="time">${timeStamp2String(new Date().getTime())}</span>  
            </div>
            <button type="button" class="btn btn-default btn-lg del">
                <span class="glyphicon glyphicon-trash" aria-hidden="true"></span>删除
            </button>
        </div>`)
        $(".del").hide()
    })
    $('.row').on("click", ".del", function () {
        $(this).parent().remove()
    })
    $(".del").hide()
    $('body').on("mouseover", ".clbox", function () {
        $(this).children("button").show()
    })
    $('body').on("mouseout", ".clbox", function () {
        $(this).children("button").hide()
    })
    // $('.row').on("click", ".revise", function () {
    //     let mytxt = $(this).siblings("div").children("p").text()

    //     $(this).parent().remove()
    //     $(".mytxt").val(`${mytxt}`)

    //     $('body').on("click", ".revisebtn", function () {
    //     let people = $(".changepeo option:selected").text()

    //     let value= $(".mytxt").val()
    //     $(".row").append(`  <div class="col-md-4 clbox">
    //         <div class="page-header">
    //             <h1>${people}</h1>
    //             <p>&emsp;&emsp;${value}</p>
    //             <span class="time">2021-12-12-21</span>  
    //         </div>
    //         <button type="button" class="btn btn-primary btn-lg revise" data-toggle="modal" data-target="#exampleModal1" data-whatever="@mdo">
    //             <span class="glyphicon glyphicon-wrench" aria-hidden="true"></span>修改
    //         </button>
    //         <button type="button" class="btn btn-default btn-lg del">
    //             <span class="glyphicon glyphicon-trash" aria-hidden="true"></span>删除
    //         </button>
    //     </div>`)

    // })

    //   let btn=document.querySelector(".revisebtn")
    //   btn.onclick=()=>{
    //       console.log("111")
    //       console.log(this)
    //   }


    // $(this).siblings("div").children("p").text(`${value}`)

    // })


    //             $('.row').on("change",".revise",function(){
    //                 let value= $(".mytxt").val()
    // $(this).iblings("div").children("p").text(value)

    //             })



})

function timeStamp2String(time) {
    var datetime = new Date();
    datetime.setTime(time);
    var year = datetime.getFullYear();
    var month = datetime.getMonth() + 1 < 10 ? "0" + (datetime.getMonth() + 1) : datetime.getMonth() + 1;
    var date = datetime.getDate() < 10 ? "0" + datetime.getDate() : datetime.getDate();
    var hour = datetime.getHours() < 10 ? "0" + datetime.getHours() : datetime.getHours();
    var minute = datetime.getMinutes() < 10 ? "0" + datetime.getMinutes() : datetime.getMinutes();
    var second = datetime.getSeconds() < 10 ? "0" + datetime.getSeconds() : datetime.getSeconds();
    return year + "-" + month + "-" + date + " " + hour + ":" + minute + ":" + second;
}